<!DOCTYPE html>
<html xmlns:layout="http://www.ultraq.net.nz/thymeleaf/layout" layout:decorate="~{layout}">

<head>
    <meta http-equiv="X-UA-Compatible" content="IE=edge"/>
    <meta name="viewport" content="width=device-width, initial-scale=1, shrink-to-fit=no"/>

    <title th:text="#{screen.consent.review.header}">Consent Review View</title>
    <link href="../../static/css/cas.css" rel="stylesheet" th:remove="tag" />

    <script th:src="@{#{webjars.datatables.jquery.datatablesmin.js}}"></script>
    <script th:src="@{#{webjars.datatables.datatables.bootstrapmin.js}}"></script>
    <script type="text/javascript" th:inline="javascript">
        var urls = {
            delete: /*[[@{/consentReview/deleteConsentDecision}]]*/,
            getConsentDecisions: /*[[@{/consentReview/getConsentDecisions}]]*/
        };
        var strings = {
            error: /*[[#{screen.consent.review.error}]]*/,
            success: /*[[#{screen.consent.review.success}]]*/,
            confirm: /*[[#{screen.consent.review.confirm}]]*/,
            yes: /*[[#{screen.consent.review.yes}]]*/,
            no: /*[[#{screen.consent.review.no}]]*/,
            data: {
                search: /*[[#{screen.consent.review.data.search}]]*/,
                zeroRecords: /*[[#{screen.consent.review.data.zerorecords}]]*/,
                info: /*[[#{screen.consent.review.data.info}]]*/,
                infoFiltered: /*[[#{screen.consent.review.data.infofiltered}]]*/,
                infoEmpty: /*[[#{screen.consent.review.data.infoempty}]]*/
            }
        };

        function jqueryReady() {
            head.load(
                /*[[@{/js/consentReview.js}]]*/
            );
        };
    </script>
    <link rel="stylesheet" th:href="@{/css/consentReview.css}"/>
</head>

<body>
<main role="main" class="container mt-3 mb-3">
    <div layout:fragment="content">
        <div id="content">
            <div class="card consentOverview">
                <div class="card-header">
                    <h3 th:utext="#{screen.consent.review.header}">Review Attribute Consent</h3>
                </div>
                <div class="card-body">
                    <div id="loadingMessage">
                        <h4 th:text="#{screen.consent.review.loading}">Loading consent decisions...</h4>
                    </div>

                    <div id="no-consent-decisions">
                        <p th:text="#{screen.consent.review.noconsentdecisions}">There are no consent decisions
                            registered for you.</p>
                    </div>

                    <div id="consent-decisons">
                        <div id="alertWrapper"></div>
                        <table id="consentDecisions" class="table table-striped table-hover">
                            <thead>
                            <th th:text="#{screen.consent.review.date}">Date</th>
                            <th th:texT="#{screen.consent.review.service}">Service</th>
                            </thead>
                            <tbody>
                            <tr class="info hidden">
                                <td class="info" colspan="3">
                                    <div>
                                        <table class="table table-bordered row-detail">
                                            <tbody>
                                            <tr>
                                                <td class="field-label active consent-created-date-label col-3"
                                                    th:utext="#{screen.consent.review.createddate}">Created Date:
                                                </td>
                                                <td class="created-date"></td>
                                            </tr>
                                            <tr>
                                                <td class="field-label active consent-reminder-label col-3"
                                                    th:utext="#{screen.consent.review.reminder}">Reminder:
                                                </td>
                                                <td class="consent-reminder">
                                                        <span class="seconds"
                                                              th:utext="#{screen.consent.options.timeunit.seconds}">Seconds</span>
                                                    <span class="minutes"
                                                          th:utext="#{screen.consent.options.timeunit.minutes}">Minutes</span>
                                                    <span class="hours"
                                                          th:utext="#{screen.consent.options.timeunit.hours}">Hours
                                                        <span class="days"
                                                              th:utext="#{screen.consent.options.timeunit.days}">Days</span>
                                                        <span class="weeks"
                                                              th:utext="#{screen.consent.options.timeunit.weeks}">Weeks</span>
                                                        <span class="months"
                                                              th:utext="#{screen.consent.options.timeunit.months}">Months</span>
                                                        <span class="years"
                                                              th:utext="#{screen.consent.options.timeunit.years}">Years</span>
                                                </td>
                                            </tr>
                                            <tr>
                                                <td class="field-label active consent-option-label col-3"
                                                    th:utext="#{screen.consent.review.option}">Option:
                                                </td>
                                                <td class="consent-options">
                                                                    <span class="attribute-name label label-default"
                                                                          th:utext="#{screen.consent.options.attributename}"
                                                                          th:title="#{screen.consent.review.options.desc.attributename}"
                                                                          data-toggle="tooltip"
                                                                          data-placement="bottom">Attribute Name</span>
                                                    <span class="attribute-value label label-default"
                                                          th:utext="#{screen.consent.options.attributevalue}"
                                                          th:title="#{screen.consent.review.options.desc.attributevalue}"
                                                          data-toggle="tooltip"
                                                          data-placement="bottom">Attribute Value</span>
                                                    <span class="always label label-default"
                                                          th:utext="#{screen.consent.options.always}"
                                                          th:title="#{screen.consent.review.options.desc.always}"
                                                          data-toggle="tooltip" data-placement="bottom">Show the consent screen every time I attempt to log in.</span>
                                                </td>
                                            </tr>
                                            <tr>
                                                <td class="field-label active consent-attributes-label col-3"
                                                    th:utext="#{screen.consent.review.attributes}">Attributes:
                                                </td>
                                                <td>
                                                    <table class="table table-striped table-bordered consent-attributes">
                                                        <thead>
                                                        <tr>
                                                            <th th:text="#{screen.consent.attributes.attribute}">
                                                                Attribute
                                                            </th>
                                                            <th th:text="#{screen.consent.attributes.values}">Value(s)
                                                            </th>
                                                        </tr>
                                                        </thead>
                                                        <tbody>
                                                        </tbody>
                                                    </table>
                                                </td>
                                            </tr>
                                            </tbody>
                                        </table>
                                        <button type="button" class="btn btn-danger"
                                                th:utext="#{screen.consent.review.delete}">DELETE
                                        </button>
                                    </div>
                                </td>
                            </tr>
                            </tbody>
                        </table>
                    </div>
                </div>
                <button type="button" name="logout" id="logout" class="btn btn-primary"
                        th:utext="#{screen.welcome.button.logout}">Logout
                </button>
            </div>
        </div>
    </div>
</main>
</body>
</html>
